<template>
	<div class="c-p-panel">
		<div class="c-p-data-view">
			<Table stripe border :columns="table.columns" :data="table.data"></Table>
		</div>
		<div class="page">
			<Page :total="table.totalsize" :current="searchParams.page + 1" :page-size="searchParams.pagesize" show-sizer show-elevator show-total @on-change="changePage" @on-page-size-change="changePage"></Page>
		</div>
	</div>
</template>

<script>
import { formatDate } from '@/libs/date-util.js';

import NoticeService from '@/services/NoticeService.js';
var $noticeService = NoticeService();

var $context = null;

var columns = [{
	type: 'index',
	width: 60,
	fixed: 'left',
	align: 'center'
}, {
	title: '标题',
	key: 'title',
	width: 200,
	fixed: 'left'
}, {
	title: '类型',
	key: 'type',
	fixed: 'left',
	width: 120,
	render: (h, params) => {
		var type = params.row.type;
		if(type == 1) {
			return "普通公告";
		} else if(type == 2) {
			return "敏感用户入驻";
		} else if(type == 3) {
			return "H5公告";
		}
	}
}, {
	title: '内容',
	key: 'content',
	width: 340
}, {
	title: '更新时间',
	key: 'updateTime',
	width: 150,
	render: (h, params) => {
		var date = new Date(params.row.updateTime * 1000);
		return formatDate(date, 'yyyy-MM-dd hh:mm:ss');
	}
}, {
	title: '创建时间',
	key: 'createTime',
	width: 150,
	render: (h, params) => {
		var date = new Date(params.row.createTime * 1000);
		return formatDate(date, 'yyyy-MM-dd hh:mm:ss');
	}
}, {
	title: '状态',
	key: 'status',
	width: 70,
	fixed: 'right',
	render: (h, params) => {
		var status = params.row.status;
		if(status == 1) {
			return "发布";
		} else if(status == 0) {
			return "删除";
		}
	}
}, {
	title: '操作',
	key: 'action',
	fixed: 'right',
	width: 80,
	render: (h, params) => {
		var nid = params.row.nid;
		var type = params.row.type;
		if(type == 1 || type == 3) {
			return h('div', [
				h('Button', {
					props: {
						type: 'text',
						size: 'small'
					},
					on: {
						click() {
							$context.$router.push({name: 'noticeEdit', query: {nid: nid}});
						}
					}
				}, '编辑')
				]);
		} else {
			return h('div', [
				h('Button', {
					props: {
						type: 'text',
						size: 'small'
					},
					on: {
						click() {
							$context.$router.push({name: 'noticeEdit', query: {userId: nid}});
						}
					}
				}, '影人')
				]);
		}
	}
}];

const $data = {
	icon: 'http://on77tknxg.bkt.clouddn.com/b3d3b511b6b04c8f882719d661170e641501999178452',
		searchParams: { //搜索参数
			page: 0,
			pagesize: 20
		},
		table: { //数据结构
			columns: columns,
			data: [],
			totalsize: 0
		}
	};

	var loadData = function() {
		$noticeService.getNotices($data.searchParams.page, $data.searchParams.pagesize)
		.then(function(response) {
			var res = response.data;
			var code = res.rescode;
			if(code == 100) {
				$data.table.data = res.data;
				$data.table.totalsize = res.totalSize;
			}
		}, function(error) {
			console.log(error);
		});
	}

	export default {
		data() {
			return $data;
		},
		methods: {
			toUserSpacePage: function(uid) {
				this.$router.push({
					name: 'userSpace',
					query: {
						uid: uid
					}
				});
			},
			changePage: function(pagesize) {
				this.searchParams.pagesize = pagesize;
				loadData();
			}
		},
		components: {},
		created: function() {
			$context = this;
		},
		mounted: function() {
			var $this = this;

			loadData();
		}
	};
	</script>

	<style scoped>
	.page {
		text-align: center;
		margin-top: 30px;
	}
	</style>